<template>
	<div class="mainsu">
		<div class="main_spac1">
			<div class="main_white padding10 paddingBottom20">
				<div class="mainor_form">
					<div class="mainor_te">
						<!-- class="mainor_tea" -->
						<el-button @click="settClick(1)">批量结算</el-button>
						<el-button @click="exportbuVisible = true"> 导出 </el-button>
					</div>
					<el-form
						:inline="true"
						:model="form"
						class="demo-form-inline"
						ref="userListFrom"
						label-width="70px"
					>
						<el-form-item label="账期" prop="payment_days">
							<el-date-picker
								v-model="form.payment_days"
								type="month"
								placeholder="选择月"
								value-format="yyyy-MM"
							>
							</el-date-picker>
						</el-form-item>
						<el-form-item label="单号" prop="related_order_sn">
							<el-input
								v-model.trim="form.related_order_sn"
								placeholder="原始单号/账单号"
								clearable
								class="wid220"
							></el-input>
						</el-form-item>
						<el-form-item label="采购方式" prop="mode">
							<el-select
								v-model.trim="form.mode"
								placeholder="采购方式"
								class="wid110"
								@change="changeMode(1)"
							>
								<el-option label="所有" value=""></el-option>
								<el-option
									v-for="(modeList, index) in list.modeList"
									:key="index"
									:label="modeList"
									:value="parseInt(index)"
								></el-option>
							</el-select>
							<el-select
								v-model.trim="form.buyer_id"
								placeholder="采购员"
								class="wid220"
								v-show="form.mode == 1"
							>
								<el-option label="所有" value=""></el-option>
								<el-option
									v-for="(buyer, index) in list.buyer"
									:key="index"
									:label="buyer"
									:value="parseInt(index)"
								></el-option>
							</el-select>
							<el-select
								v-model.trim="form.supplier_id"
								placeholder="普通供应商"
								class="wid220"
								v-show="form.mode == 2"
							>
								<el-option label="所有" value=""></el-option>
								<el-option
									v-for="(supplier, index) in list.supplier"
									:key="index"
									:label="supplier"
									:value="parseInt(index)"
								></el-option>
							</el-select>
							<el-select
								v-model.trim="form.supplier_id"
								placeholder="直供供应商"
								class="wid220"
								v-show="form.mode == 3"
							>
								<el-option label="所有" value=""></el-option>
								<el-option
									v-for="(supplier, index) in list.direct_supply"
									:key="index"
									:label="supplier"
									:value="parseInt(index)"
								></el-option>
							</el-select>
							<el-select
								v-model.trim="form_mode_all"
								placeholder="所有"
								class="wid220"
								v-show="!form.mode"
							>
								<el-option label="所有" value=""></el-option>
							</el-select>
						</el-form-item>

						<div class="more el-form-item" @click="more">
							<span>更多</span>
							<i :class="[{ on: moredata }, ' el-icon-arrow-down']"></i>
						</div>
						<div class="clearfix"></div>
						<el-collapse-transition>
							<div v-if="moredata">
								<el-form-item label="商品" prop="goods_spu_id">
									<change-goods-input
										ref="changeGoodsInput"
										@clear="
											() => {
												this.form.goods_spu_id = '';
											}
										"
										@sendValue="
											(data) => {
												this.form.goods_spu_id = data.id;
											}
										"
									></change-goods-input>
								</el-form-item>
								<el-form-item label="账单日期" prop="establishTime">
									<el-date-picker
										v-model="establishTime"
										type="daterange"
										class="time220"
										:editable="false"
										unlink-panels
										range-separator="至"
										start-placeholder="开始日期"
										end-placeholder="结束日期"
										value-format="yyyy-MM-dd"
										:clearable="false"
										:picker-options="pickerOptions"
									/>
								</el-form-item>
								<el-form-item label="对账状态" prop="account_status">
									<el-select
										v-model.trim="form.account_status"
										placeholder="对账状态"
										class="wid220"
									>
										<el-option label="所有" value=""></el-option>
										<el-option
											v-for="(
												account_status_list, index
											) in list.account_status_list"
											:key="index"
											:label="account_status_list"
											:value="parseInt(index + 1)"
										></el-option>
									</el-select>
								</el-form-item>
								<el-form-item label="结算状态" prop="status">
									<el-select
										v-model.trim="form.status"
										placeholder="结算状态"
										class="wid220"
									>
										<el-option label="所有" value=""></el-option>
										<el-option
											v-for="(statusList, index) in list.statusList"
											:key="index"
											:label="statusList"
											:value="parseInt(index + 1)"
										></el-option>
									</el-select>
								</el-form-item>
								<el-form-item label="结算日期" prop="createTime">
									<el-date-picker
										v-model="createTime"
										type="daterange"
										class="time220"
										:editable="false"
										unlink-panels
										range-separator="至"
										start-placeholder="开始日期"
										end-placeholder="结束日期"
										value-format="yyyy-MM-dd"
										:clearable="false"
										:picker-options="pickerOptions"
									/>
								</el-form-item>

								<el-form-item label="单据类型" prop="type">
									<el-select
										v-model.trim="form.type"
										placeholder="单据类型"
										class="wid220"
									>
										<el-option label="所有" value=""></el-option>
										<el-option
											v-for="(typeList, index) in list.typeList"
											:key="index"
											:label="typeList"
											:value="parseInt(index)"
										></el-option>
									</el-select>
								</el-form-item>

								<!-- <el-form-item label="对账单号" prop="order_sn">
                  <el-input
                    v-model.trim="form.order_sn"
                    placeholder="对账单号"
                    clearable
                    class="wid220"
                  ></el-input>
                </el-form-item> -->

								<div class="clearfix"></div>
							</div>
						</el-collapse-transition>
						<el-form-item class="marginTop10">
							<el-button
								class="reset marginLeft10"
								type="primary"
								@click="reset"
								>重置</el-button
							>
							<el-button
								type="primary"
								@click="getArticleList"
								:loading="listLoading"
								>搜索</el-button
							>
						</el-form-item>
					</el-form>
				</div>
				<div class="main_num boxdq">
					<div class="main_num_l box">
						<p>
							<em
								>注意：对账单未对账也可结算；只有同一采购方式、同一采购员/供应商才能进行批量结算；对账单结算后，不可再进行对账；</em
							>
						</p>
					</div>
				</div>
				<div class="main_table marginTop10" style="min-height: 550px">
					<el-table
						ref="multipleTable"
						v-loading="listLoading"
						:data="list.list.data"
						element-loading-text="加载中"
						fit
						border
						highlight-current-row
						show-overflow-tooltip
						tooltip-effect="dark"
						@selection-change="handleSelectionChange"
						:header-cell-class-name="this.$verticaline"
					>
						<el-table-column type="selection" :selectable="selectInit" />
						<el-table-column
							label="原始单号"
							width="200"
							prop="related_order_sn"
							show-overflow-tooltip
						/>
						<el-table-column show-overflow-tooltip label="单据类型" width="120">
							<template slot-scope="scope"
								><span :class="'type' + scope.row.type">
									{{ list.typeList[scope.row.type] }}</span
								></template
							>
						</el-table-column>
						<el-table-column show-overflow-tooltip label="采购方式" width="120">
							<template slot-scope="scope">{{
								list.modeList[scope.row.mode]
							}}</template>
						</el-table-column>
						<el-table-column
							show-overflow-tooltip
							label="采购员/供应商"
							width="140"
						>
							<template slot-scope="scope">{{
								buyerAndSupplierTable(scope.row)
							}}</template>
						</el-table-column>
						<el-table-column
							label="账期"
							show-overflow-tooltip
							width="120"
							prop="payment_days"
						>
						</el-table-column>
						<!-- <el-table-column
              label="账期"
              width="120"
              prop="related_order_sn"
            >
              <template slot-scope="scope">{{
                scope.row.purchase_time
                  ? parseTime(scope.row.purchase_time, "{y}-{m}-{d}")
                  : ""
              }}</template>
            </el-table-column> -->
						<el-table-column
							label="应付金额"
							width="120"
							prop="account_money"
						/>
						<el-table-column
							label="实付金额"
							width="120"
							show-overflow-tooltip
							prop="paid"
						/>
						<el-table-column
							label="抹零金额"
							width="120"
							show-overflow-tooltip
							prop="zero_amount"
						/>
						<el-table-column
							label="未付金额"
							width="120"
							show-overflow-tooltip
							prop="unpaid"
						/>
						<el-table-column
							label="账单号"
							width="120"
							show-overflow-tooltip
							prop="order_sn"
						/>
						<el-table-column
							label="对账状态"
							show-overflow-tooltip
							width="120"
							prop="status"
						>
							<template slot-scope="scope"
								><span
									:class="scope.row.account_status == 1 ? 'success' : 'unpaid'"
									>{{
										list.account_status_list[scope.row.account_status]
									}}</span
								></template
							>
						</el-table-column>
						<el-table-column label="结算状态" width="120" prop="status">
							<template slot-scope="scope"
								><span :class="'type' + scope.row.status">{{
									list.statusList[scope.row.status]
								}}</span></template
							>
						</el-table-column>
						<!-- <el-table-column label="结算时间" width="120" prop="status">
              <template slot-scope="scope">
                {{
                  scope.row.settle_time
                    ? parseTime(scope.row.settle_time, "{y}-{m}-{d}")
                    : ""
                }}
              </template>
            </el-table-column> -->

						<el-table-column
							label="管理操作"
							align="left"
							fixed="right"
							width="240"
							class-name="main_hei handle"
							class="handle"
						>
							<template slot-scope="scope">
								<router-link :to="'/financial/recharge/see/' + scope.row.id">
									<el-link type="success">查看</el-link>
								</router-link>
								<router-link
									:to="'/financial/recharge/record/' + scope.row.id"
									v-if="scope.row.status == 0"
								>
									<el-link type="warning">对账</el-link>
								</router-link>
								<el-link
									type="primary"
									@click="(id = scope.row.id), settClick(2)"
									v-if="scope.row.status != 2"
									>结算</el-link
								>
								<el-link
									style="color: rgb(17, 138, 178)"
									@click="exportOrderiInfo(scope.row.id)"
									v-if="scope.row.status == 2"
									>导出</el-link
								>
								<el-link
									@click="print(scope.row.id)"
									v-if="scope.row.status == 2"
									>打印</el-link
								>
								<el-dropdown v-if="scope.row.status != 2">
									<span class="el-dropdown-link" style="cursor: pointer">
										更多<i class="el-icon-arrow-down el-icon--right"></i>
									</span>
									<el-dropdown-menu slot="dropdown">
										<el-dropdown-item>
											<el-link
												style="color: rgb(17, 138, 178)"
												@click="exportOrderiInfo(scope.row.id)"
												>导出</el-link
											></el-dropdown-item
										>
										<el-dropdown-item>
											<el-link @click="print(scope.row.id)"
												>打印</el-link
											></el-dropdown-item
										>
									</el-dropdown-menu>
								</el-dropdown>
							</template>
						</el-table-column>
					</el-table>
				</div>
				<div class="main_page boxdq">
					<div></div>
					<!-- 分页 -->
					<div class="main_page_r">
						<el-pagination
							:current-page="current.page"
							:page-sizes="[20, 50, 100, 200]"
							:page-size="limit"
							layout="total, sizes, prev, pager, next, jumper"
							:total="totalCount"
							background
							@size-change="changeLimit"
							@current-change="changePage"
						/>
					</div>
				</div>

				<!-- 结算 -->
				<el-dialog
					title="结算"
					:visible.sync="settFormVisible"
					class="main_dialog dialog840"
				>
					<el-form
						:inline="false"
						:rules="rules"
						:model="info"
						class="demo-form-inline"
						ref="userListFrom1"
						label-width="0"
						key="userListFrom1"
					>
						<div class="main_xq">
							<ul class="boxha">
								<li>
									采购方式：<span>{{
										info.data.modeList[info.data.info.mode]
									}}</span>
								</li>
								<li>
									采购员/供应商：<span>{{
										info.data.info.mode == 1
											? info.data.buyer[info.data.info.buyer_id]
											: info.data.supplier[info.data.info.supplier_id]
									}}</span>
								</li>
								<li>
									应付金额：<span>{{ info.data.info.money }}</span>
								</li>
								<li>
									已付金额：<span>{{ info.data.info.paid }}</span>
								</li>
								<li>
									未付金额：<span>{{ info.data.info.unpaid }}</span>
								</li>
								<li>
									付款金额：<span>{{ total }}</span>
								</li>
								<div class="clearfix"></div>
								<li class="main_w100 marginTop10 boxha boxnr">
									付款方式：
									<span class="main_xqs" style="width: 30%">
										<el-form-item
											label=""
											prop="info_form.pay_type"
											:rules="rules.pay_type"
										>
											<el-select
												v-model.trim="info.info_form.pay_type"
												placeholder="付款方式"
												class="wid220"
											>
												<el-option
													v-for="(pay_type_list, index) in info.data
														.pay_type_list"
													:key="index"
													:label="pay_type_list"
													:value="parseInt(index)"
												></el-option>
											</el-select>
										</el-form-item>
									</span>
								</li>
								<li class="main_w100 marginTop15 boxha boxnr">
									收款人：
									<span class="main_xqs" style="width: 30%">
										<el-form-item
											label=""
											prop="info_form.payee"
											:rules="rules.payee"
										>
											<el-input
												v-model.trim="info.info_form.payee"
												placeholder="收款人"
												clearable
											></el-input>
										</el-form-item>
									</span>
								</li>
								<li class="main_w100 marginTop15 boxha boxnr">
									备注：
									<span class="main_xqs" style="margin-left: 12px">
										<el-form-item label="" prop="info_form.remark">
											<el-input
												v-model.trim="info.info_form.remark"
												placeholder="备注"
												clearable
											></el-input>
										</el-form-item>
									</span>
								</li>
								<li class="main_w100 marginTop15 boxha">
									上传凭证(3张)：
									<span class="main_xqs">
										<div class="box main_xqi">
											<div class="main_upImg">
												<el-upload
													:action="uploadPath"
													list-type="picture-card"
													:on-success="handSuccess"
													:on-remove="handleRemove"
													:limit="3"
													:file-list="filelist"
												>
													<span slot="default">
														<svg
															aria-hidden="true"
															class="main_page_svg"
															width="32"
															height="27"
														>
															<use xlink:href="#icon-commodit_camera" />
														</svg>
													</span>
												</el-upload>
												<div class="clearfix"></div>
											</div>
										</div>
									</span>
								</li>
							</ul>
						</div>
						<div class="main_table marginTop0">
							<el-table
								ref="multipleTable1"
								v-loading="listLoading"
								:data="info.data.list"
								element-loading-text="加载中"
								fit
								highlight-current-row
								key="multipleTable1"
							>
								<el-table-column
									label="单据号"
									prop="order_sn"
									width="180"
									class-name="main_hei"
								/>
								<el-table-column label="单据类型" width="120">
									<template slot-scope="scope">{{
										info.data.typeList[scope.row.type]
									}}</template>
								</el-table-column>
								<el-table-column
									label="应付金额"
									prop="account_money"
									width="120"
									class-name="main_hei"
								/>
								<el-table-column
									label="已付金额"
									prop="paid"
									width="120"
									class-name="main_hei"
								/>
								<el-table-column
									label="未付金额"
									prop="unpaid"
									width="120"
									class-name="main_hei"
								/>
								<el-table-column
									label="付款金额"
									prop="pay_money"
									width="150"
									class-name="main_hei"
								>
									<template slot-scope="scope">
										<el-form-item
											:prop="'data.list.' + scope.$index + '.pay_money'"
											:rules="rules.pay_money"
											label-width="10px"
											label=" "
										>
											<el-input
												v-model.trim="scope.row.pay_money"
												placeholder="付款金额"
												class="wid110"
											></el-input>
										</el-form-item>
									</template>
								</el-table-column>
								<el-table-column
									label="抹零金额"
									prop="zero_amount"
									width="150"
									class-name="main_hei"
								>
									<template slot-scope="scope">
										<el-form-item
											:prop="'data.list.' + scope.$index + '.zero_amount'"
											:rules="rules.zero_amount"
											label-width="10px"
											label=" "
										>
											<el-input
												v-model.trim="scope.row.zero_amount"
												placeholder="抹零金额"
												class="wid110"
											></el-input>
										</el-form-item>
									</template>
								</el-table-column>
								<el-table-column
									label="剩余未付"
									width="120"
									class-name="main_hei"
								>
									<template slot-scope="scope">{{
										scope.row.unpaid - scope.row.pay_money
											? $toFixed(
													scope.row.unpaid -
														scope.row.pay_money -
														scope.row.zero_amount
											  )
											: "0.00"
									}}</template>
								</el-table-column>
								<el-table-column
									label="备注"
									prop="remark"
									width="350"
									class-name="main_hei"
								>
									<template slot-scope="scope">
										<el-form-item label-width="0" label="">
											<el-input
												v-model.trim="scope.row.remark"
												placeholder="备注"
												class="wid240"
											></el-input>
										</el-form-item>
									</template>
								</el-table-column>
							</el-table>
						</div>
					</el-form>
					<div slot="footer" class="dialog-footer">
						<span class="footer_red">合计:￥{{ total }}</span>
						<el-button type="primary" @click="settupmine" v-repeatClick
							>结 算</el-button
						>
					</div>
				</el-dialog>
				<!-- 订单导出 -->
				<el-dialog
					title="采购账单导出"
					:visible.sync="exportbuVisible"
					class="main_dialog dialog500"
				>
					<p class="exptitle">选择导出时间</p>
					<el-date-picker
						v-model="exportTime"
						type="daterange"
						range-separator="至"
						start-placeholder="开始日期"
						end-placeholder="结束日期"
						format="yyyy-MM-dd"
						value-format="yyyy-MM-dd"
						@change="dateChange"
					>
					</el-date-picker>
					<el-tooltip
						class="item"
						effect="dark"
						content="时间范围只能选择两个月之内"
						placement="top"
					>
						<i class="el-icon-question"></i>
					</el-tooltip>
					<p class="exptitle" style="padding-top: 10px">采购方式</p>

					<el-select
						v-model.trim="export_mode"
						placeholder="采购方式"
						class="wid110"
						@change="changeMode(2)"
					>
						<el-option label="所有" value=""></el-option>
						<el-option
							v-for="(modeList, index) in list.modeList"
							:key="index"
							:label="modeList"
							:value="parseInt(index)"
						></el-option>
					</el-select>
					<el-select
						v-model.trim="export_buyer_id"
						placeholder="采购员"
						class="wid220"
						v-show="export_mode == 1"
					>
						<el-option label="所有" value=""></el-option>
						<el-option
							v-for="(buyer, index) in list.buyer"
							:key="index"
							:label="buyer"
							:value="parseInt(index)"
						></el-option>
					</el-select>
					<el-select
						v-model.trim="export_supplier_id"
						placeholder="供应商"
						class="wid220"
						v-show="export_mode == 2"
					>
						<el-option label="所有" value=""></el-option>
						<el-option
							v-for="(supplier, index) in list.supplier"
							:key="index"
							:label="supplier"
							:value="parseInt(index)"
						></el-option>
					</el-select>
					<el-select
						v-model.trim="export_mode_all"
						placeholder="所有"
						class="wid220"
						v-show="!export_mode"
					>
						<el-option label="所有" value=""></el-option>
					</el-select>

					<div slot="footer" class="dialog-footer">
						<el-button @click="exportbuVisible = false">取 消</el-button>
						<el-button type="primary" @click="handleExport" v-repeatClick
							>确 定</el-button
						>
					</div>
				</el-dialog>
			</div>
			<!-- 打印子组件 -->
			<order-print
				ref="printTemplate"
				v-show="false"
				id="printname"
			></order-print>
		</div>
	</div>
</template>

<script>
	import {
		account_index,
		account_paid,
		account_getList,
		export_AccountStatement,
		export_account,
	} from "@/api/financial/financialRecharge";
	import { apiUrl, objKeySort, Md5 } from "@/utils/public";
	import dateOption from "@/options/dateOption";
	import {
		parseTime,
		getWeekStartAndEnd,
		exportMethod,
		getNowMonth,
	} from "@/utils/index";
	import rules from "@/rules/financial/financialRecharge";
	import { uploadPath } from "@/api/currency";
	import OrderPrint from "@/views/order/orderPrint.vue";
	export default {
		components: {
			OrderPrint,
		},
		computed: {
			total() {
				let zs = 0;
				this.info.data.list.forEach((e) => {
					zs += parseFloat(this.$toFixed(parseFloat(e.pay_money)));
				});
				return zs ? this.$toFixed(zs) : 0;
			},
		},

		data() {
			return {
				getNowMonth,
				// 验证
				rules,
				// 上传图片
				filelist: [],
				uploadPath,
				// 时间
				parseTime,
				exportMethod,
				// 分页
				current: {
					page: 1,
					per_page: 20,
				},
				limit: 20,
				totalCount: 1,
				// 列表数据
				list: {
					list: [],
				},
				info: {
					data: {
						info: {
							order_sn: "",
							contact: "",
							mobile: "",
							address: "",
							admin_user_name: {
								name: "",
							},
						},
						list: [],
						buyer: ["未分拣"],
						modeList: ["未分拣"],
						supplier: ["未分拣"],
						pay_type_list: ["未分拣"],
						typeList: ["未分拣"],
					},
					info_form: {
						mode: null,
						buyer_id: null,
						supplier_id: null,
						pay_type: null,
						payee: "",
						remark: "",
						pics: [],
					},
				},
				id: "",
				type: 1,
				settFormVisible: false,
				listLoading: false,
				// 搜索
				form: {
					account_status: null,
					status: null,
					type: null,
					goods_spu_id: "",
					order_sn: "",
					related_order_sn: "",
					account_start_time: "",
					account_end_time: "",
					start_time: "",
					end_time: "",
					mode: null,
					buyer_id: null,
					supplier_id: null,
					payment_days: "",
				},
				form_mode_all: null,
				createTime: [],
				establishTime: [],
				pickerOptions: dateOption,
				// 更多
				moredata: false,
				// 全选
				selectArr: [],
				exportTime: [],
				export_uid: "",
				exportbuVisible: false,
				export_mode: null,
				export_mode_all: null,
				export_supplier_id: "",
				export_buyer_id: "",
			};
		},
		activated() {
			if (this.$route.params.status) {
				this.form.status = parseInt(this.$route.params.status);
			}
			if (this.$route.params.payment_days) {
				this.form.payment_days = this.$route.params.payment_days;
			}
			if (this.$route.params.mode) {
				this.form.mode = this.$route.params.mode;
				this.form.supplier_id = null;
				this.form.buyer_id = null;
				if (this.$route.params.mode == 1) {
					this.form.buyer_id = this.$route.params.buyer_id;
				} else if (this.$route.params.mode == 2) {
					this.form.supplier_id = this.$route.params.supplier_id;
				}
			}

			// 列表
			this.account_index();
		},
		methods: {
			buyerAndSupplierTable(val) {
				let flag = null;
				try {
					switch (val.mode) {
						case 1:
							flag = this.list.buyer[val.buyer_id];
							break;
						case 2:
							flag = this.list.supplier[val.supplier_id];
							break;
						case 3:
							flag = this.list.direct_supply[val.supplier_id];
							break;
					}
				} catch (error) {
					console.log(error);
				}
				return flag;
			},
			// 监听绑定全选不可勾选
			selectInit(row, index) {
				if (row.status != 2) {
					return true;
				} else {
					return false;
				}
			},
			// 监听全选
			handleSelectionChange(val) {
				this.selectArr = [];
				val.map((item) => {
					this.selectArr.push({ id: item.id });
				});
			},
			// 上传图片-删除
			handleRemove(file) {
				const i = this.info.info_form.pics.findIndex(
					(item) => item.path == file.path
				);
				this.info.info_form.pics.splice(i, 1);
			},
			// 上传图片-成功
			handSuccess(res, file, fileList) {
				// console.log(res, file, fileList);
				this.info.info_form.pics.push({
					name: "",
					path: res.path,
					url: res.src,
				});
			},
			// 结算
			settClick(type) {
				if (type == 1) {
					if (this.selectArr.length == 0) {
						this.$message.error("请勾选订单");
						return;
					}
				}
				this.type = type;
				let ids = type == 1 ? this.selectArr : [{ id: this.id }];
				let ids_copy = JSON.parse(JSON.stringify(ids));
				let data = Object.assign(
					{
						sign: Md5(
							objKeySort(Object.assign(apiUrl().name)) + apiUrl().appsecret
						),
					},
					apiUrl().name,
					{ ids: JSON.stringify(ids) }
				);

				let arr_ids = ids_copy.map((e) => {
					return e.id;
				});
				let new_ids = arr_ids.join(",");
				if (type == 1) {
					account_getList(data).then((res) => {
						if (res.errcode == 0) {
							this.$router.push({
								name: "financial_recharge_final",
								params: { ids: new_ids },
							});
						} else {
							this.$message.error(res.errmsg);
						}
					});
				} else {
					this.$router.push({
						name: "financial_recharge_final",
						params: { ids: new_ids },
					});
				}
			},
			settupmine() {
				this.$refs["userListFrom1"].validate((valid) => {
					if (valid) {
						this.$confirm("确定结算吗?", "提示", {
							confirmButtonText: "确定",
							cancelButtonText: "取消",
							type: "warning",
						})
							.then(() => {
								let arry = [];
								let info = JSON.parse(JSON.stringify(this.info));
								info.info_form.pics = info.info_form.pics
									.map((e) => e.path)
									.join(",");
								info.data.list.map((e) => {
									arry.push({
										id: e.id,
										pay_money: e.pay_money,
										zero_amount: e.zero_amount,
										remark: e.remark,
									});
								});
								let data = Object.assign(
									{
										sign: Md5(
											objKeySort(Object.assign(apiUrl().name)) +
												apiUrl().appsecret
										),
									},
									apiUrl().name,
									info.info_form,
									{ list: JSON.stringify(arry) }
								);
								account_paid(data).then((res) => {
									this.settFormVisible = false;
									if (res.errcode == 0) {
										this.$message({
											message: "结算成功",
											type: "success",
										});
										this.account_index();
									} else {
										this.$message.error(res.errmsg);
									}
								});
							})
							.catch(() => {});
					}
				});
			},
			// 搜索
			getArticleList() {
				this.current.page = 1;
				this.account_index();
			},
			// 重置
			reset() {
				this.$refs["userListFrom"].resetFields();
				if (this.$refs["changeGoodsInput"]) {
					this.$refs["changeGoodsInput"].name = "";
				}
				this.form.supplier_id = null;
				this.form.buyer_id = null;
				this.getArticleList();
			},
			// 采购方式切换
			changeMode(type) {
				this.form_mode_all = null;
				this.form.supplier_id = "";
				this.form.buyer_id = "";
			},
			// 更多
			more() {
				this.moredata = !this.moredata;
			},
			// 分页
			changeLimit(pageSize) {
				this.current.per_page = pageSize;
				this.account_index();
			},
			changePage(page) {
				this.current.page = page;
				this.account_index();
			},
			// 列表
			account_index() {
				this.listLoading = true;
				let data = Object.assign(
					{
						sign: Md5(
							objKeySort(
								Object.assign(apiUrl().name, this.list_form(), this.current)
							) + apiUrl().appsecret
						),
					},
					apiUrl().name,
					this.list_form(),
					this.current
				);
				account_index(data).then((res) => {
					this.listLoading = false;
					if (res.errcode == 0) {
						this.list = res.data;
						this.totalCount = res.data.list.total;
					} else {
						this.$message.error(res.errmsg);
					}
				});
			},
			list_form() {
				let form = JSON.parse(JSON.stringify(this.form));
				form.start_time = this.createTime[0] ? this.createTime[0] : "";
				form.end_time = this.createTime[1] ? this.createTime[1] : "";
				form.account_start_time = this.establishTime[0]
					? this.establishTime[0]
					: "";
				form.account_end_time = this.establishTime[1]
					? this.establishTime[1]
					: "";

				return form;
			},
			// 打印
			print(id) {
				this.$refs.printTemplate.$emit("demo", { id: id, type: "account" });
			},
			exportOrderiInfo(id) {
				let data = Object.assign(
					{
						sign: Md5(
							objKeySort(Object.assign(apiUrl().name)) + apiUrl().appsecret
						),
					},
					apiUrl().name,
					{ id: id }
				);
				export_AccountStatement(data)
					.then((res) => {
						this.exportMethod(res, "采购账单详情");
					})
					.catch(() => {
						this.$message.error("导出失败");
					});
			},
			// 导出
			handleExport() {
				if (this.exportTime.length == 0) {
					this.$message.warning("请选择需要导出的时间段");
					return;
				}
				let form = {
					start_time: "",
					end_time: "",
					mode: this.export_mode,
					buyer_id: this.export_buyer_id,
					supplier_id: this.export_supplier_id,
				};

				if (this.exportTime && this.exportTime.length > 0) {
					form.start_time = this.exportTime[0];
					form.end_time = this.exportTime[1];
				}
				let data = Object.assign(
					{
						sign: Md5(
							objKeySort(Object.assign(apiUrl().name, form)) + apiUrl().appsecret
						),
					},
					apiUrl().name,
					form
				);
				export_account(data).then((res) => {
					this.exportMethod(res, "采购账单");
				});
				this.exportbuVisible = false;
				this.$nextTick(() => {
					this.exportTime = [];
					this.export_mode = null;
					this.export_mode_all = null;
					this.export_supplier_id = "";
					this.export_buyer_id = "";
				});
			},
			// 日期选择
			dateChange(val) {
				let start = val ? new Date(val[0]).getTime() : 0;
				let end = val ? new Date(val[1]).getTime() : 0;
				let diff = start - end;
				if (Math.abs(diff) > 3600 * 1000 * 24 * 60) {
					this.$message.warning("选择时间跨度不能超过两个月");
					this.exportTime = this.getNowMonth();
				}
			},
		},
	};
</script>
<style lang="scss" scoped>
@import "@/styles/variables.scss";

.mainsu {
	.mainor_form form {
		width: calc(100% - 180px);
	}

	.main_dialog {
		.main_xq {
			/deep/.el-form-item--small.el-form-item {
				margin-bottom: 0;
			}
		}

		.main_table {
			/deep/.el-table__body-wrapper {
				overflow-y: auto;
				height: 200px;
			}
			/deep/.el-table--small td {
				padding-top: 0;
			}
			/deep/.el-form-item--small.el-form-item {
				margin-bottom: 16px;
				margin-top: 16px;
				margin-right: 0;
			}
		}
		.main_xq ul li {
			width: 33.33%;
			margin-top: 5px;
			margin-bottom: 5px;
			.main_xqs {
				width: 85%;
				display: block;
				text-align: left;
				/deep/.el-input--small {
					width: 100%;
				}
			}
		}
		.footer_red {
			font-size: 16px;
			color: red;
			margin-right: 10px;
		}
	}
}
// 支付状态
.success {
	color: $green;
}
.unpaid {
	color: $colour_red;
}
// 订单状态
.order0 {
	color: $order_color4;
}
.order1 {
	color: $order_color1;
}

.type0 {
	color: $colour_red;
}
.type2 {
	color: $colour_red;
}
.type1 {
	color: $green;
}

/deep/.main_table .el-table--small td.handle .cell {
	display: flex;
	flex-direction: row;
	align-items: center;
}
// 导出订单表头
.exptitle {
	display: block;
	font-size: 16px;
	color: #000000;
	margin: 0 0 10px;
	cursor: pointer;
}
</style>
